import React from 'react';
import {
  DeleteOutlined, ArrowDownOutlined, MoreOutlined, ExportOutlined 
} from '@ant-design/icons';
import { Avatar, Card } from 'antd';

const { Meta } = Card;

function CardMain({ data }) {
  return (
    <Card
    style={{
      width: 300
    }}
    cover={(
      <img
        style={{ width: 100, height: '100px', marginLeft: 100 }}
        alt="example"
        src={data.logo}
      />
    )}
    actions={[
      <ArrowDownOutlined key="download" />,
      <ExportOutlined key="export" />,
      <DeleteOutlined key="delete" />,
      <MoreOutlined
        key="more"
        onClick={() => { 
          window.localStorage.info = JSON.stringify(data.info);
          window.location.href = '/info'; 
        }}
      />,
    ]}
    >
      <Meta
      avatar={<Avatar src={data.icon} />}
      title={data.title}
      description={data.des}
      />
    </Card>
  );
}

export default CardMain;